import * as echart from 'echarts';
import { ref, onMounted, onBeforeUnmount,shallowRef} from 'vue';
export function useEchatrs() {
    const myChart = ref(null);
    const options = null;
    onMounted(() => {
        initCharts();
        console.log(6666666666); 
    });
    // 初始化图表
    const initCharts = () => {
        myChart.value = echart.init(document.getElementById(props.id));
        renderEchart();
        // 页面大小变化重置图表
        window.addEventListener("resize", () => {
            myChart.value.resize();
        });
    }
    // 设置echarts配置项
    const renderEchart = ()=>{
        myChart.value.setOption(options);
    }
    const clearEchart = () => {
        myChart.clear();
    }
    onBeforeUnmount(() => {
        // 销毁echarts实例
        myChart.value = null
        clearEchart()
    })

    return {
        myChart,
        options
    }
}